<!-- 检验检疫申报要素 -->
<template>
    <Modal :value="value" @input="handleInput" width="746" :closable="false">
        <div slot="header">
            检验检疫申报要素
            <Icon class="f-fr" type="ios-close" @click="closeModal"/>
        </div>
        <div class="content-body">
            <Table
                ref="declareEleRef"
                @on-selection-change="selectionSelectHandle"
                highlight-row
                :columns="columns"
                :data="tableList"
            ></Table>
        </div>
        <div slot="footer">
            <Button type="default" @click="closeModal">取消</Button>
            <Button type="primary" @click="saveCIQdeclareEle">确定</Button>
        </div>
    </Modal>
</template>

<script>
export default {
    name: 'CIQdeclareEleModal',
    props: {
        value: {
            default: false,
            type: Boolean
        },
        CIQdeclareEle: {
            default: function () {
                return {
                    tempArr: [],
                    editORshow: false
                }
            },
            type: Object
        }
    },
    data () {
        let tableList = [
            {
                dataCode: '11',
                dataName: '品质证书'
            },
            {
                dataCode: '12',
                dataName: '重量证书'
            },
            {
                dataCode: '13',
                dataName: '数量证书'
            },
            {
                dataCode: '14',
                dataName: '兽医卫生证书'
            },
            {
                dataCode: '15',
                dataName: '健康证书'
            },
            {
                dataCode: '16',
                dataName: '卫生证书'
            },
            {
                dataCode: '17',
                dataName: '动物卫生证书'
            },
            {
                dataCode: '18',
                dataName: '植物检疫证书'
            },
            {
                dataCode: '19',
                dataName: '熏蒸/消毒证书'
            },
            {
                dataCode: '20',
                dataName: '出境货物换证凭单'
            },
            {
                dataCode: '21',
                dataName: '入境货物检验检疫证明（申请出具）'
            },
            {
                dataCode: '22',
                dataName: '出境货物不合格通知单'
            },
            {
                dataCode: '23',
                dataName: '集装箱检验检疫结果单'
            },
            {
                dataCode: '24',
                dataName: '入境货物检验检疫证明（申请不出具）'
            },
            {
                dataCode: '94',
                dataName: '电子底账'
            },
            {
                dataCode: '95',
                dataName: '入境货物调离通知单'
            },
            {
                dataCode: '96',
                dataName: '出境货物检验检疫工作联系单'
            },
            {
                dataCode: '98',
                dataName: '其他单'
            },
            {
                dataCode: '99',
                dataName: '其他证书'
            }
        ]
        tableList.forEach(item => {
            item._checked = false
            item._disabled = false
        })
        return {
            editORshow: null,
            columns: [
                {
                    type: 'selection',
                    align: 'center',
                    width: 100
                },
                {
                    title: '证书代码',
                    key: 'dataCode',
                    width: 100
                },
                {
                    title: '证书名称',
                    key: 'dataName'
                },
                {
                    title: '正本数量',
                    key: 'dataSecondType',
                    width: 100
                },
                {
                    title: '副本数量',
                    key: 'dataThirdType',
                    width: 100
                }
            ],
            tableList,
            selectedTableList: []
        }
    },
    mounted () {
        this.init(this.CIQdeclareEle.tempArr, this.CIQdeclareEle.editORshow)
    },
    methods: {
        init (originList, editORshow) {
            this.$nextTick(() => {
                this.editORshow = editORshow
                const list = originList.slice()
                this.tableList.forEach(item => {
                    item._disabled = editORshow
                    const index = list.findIndex(v => (v === item.dataCode || v === item.dataName))
                    item._checked = index > -1
                    item._checked && list.splice(index, 1)
                })
            })
        },
        handleInput (v) {
            this.$emit('input', v)
        },
        closeModal () {
            this.handleInput(false)
        },

        selectionSelectHandle (val) {
            this.selectedTableList = val
        },

        saveCIQdeclareEle () {
            let codeList = []
            let nameList = []
            if (this.selectedTableList.length > 0) {
                this.selectedTableList.forEach(item => {
                    codeList.push(item.dataCode)
                    nameList.push(item.dataName)
                })
            }
            let res = {
                list: this.selectedTableList,
                codes: codeList.join(),
                names: nameList.join()
            }
            this.$emit('saveCIQdeclareEle', res)
            this.closeModal()
        }
    }
}
</script>

<style scoped>

</style>
